<!DOCTYPE html>
<html class="x-admin-sm">

<head>
    <meta charset="UTF-8">
    <title>分权管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
    <link rel="stylesheet" href="../css/font.css">
    <link rel="stylesheet" href="../css/xadmin.css">
    <link rel="stylesheet" href="../css/zTreeStyle/zTreeStyle.css">
    <script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="../js/xadmin.js"></script>
    <script src="../js/base.js"></script>
    <script src="../js/jquery.min.js"></script>
    <script src="../js/jquery.ztree.core-3.5.js"></script>
    <script src="../js/jquery.ztree.excheck-3.5.js"></script>
    <script src="../js/jquery.form.js"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<style>
    .layui-btn {
        height: 30px !important;
        line-height: 30px !important;
    }
</style>

<body>
<div class="layui-fluid">
    <div class="layui-row">
        <div class="layui-col-md12">
            <div class="layui-card" style="display: flex;justify-content: space-between;">
                <div class="layui-card-body ">
                    <blockquote class="layui-elem-quote" style="border:0;font-size: 18px;color: #000;">分权管理
                    </blockquote>
                </div>
            </div>
        </div>
        <div class="layui-col-md12">
            <form class="layui-form">
                <div class="layui-form-item">
                    <label for="type" class="layui-form-label">
                        <span class="x-red">*</span>角色类型
                    </label>
                    <div class="layui-input-inline">
                        <select name="type" id="type" lay-filter="type" lay-verify="required">
                            <option value="">请选择</option>
                        </select>
                    </div>
                </div>
            </form>
            <div class="layui-col-md12">
                <div style="margin-left:100px;">
                    <ul id="tree" class="ztree"></ul>
                </div>
            </div>
        </div>
        <div class="layui-col-md12">
            <div class="layui-form-item" style="text-align: center">
                <button type="button" lay-filter="add"
                        class="layui-btn" onclick="submitAuth()">提交
                </button>
            </div>
        </div>
    </div>
</div>
<script>layui.use(['form', 'layer'],
    function () {
        $ = layui.jquery;
        var form = layui.form,
            layer = layui.layer;
        $.get(getRequestPrefix() + "/admin/auth/toList", function (data) {
            if (data.msg) {
                parent.window.location.href = getRequestPrefix() + "/footBallAdmin/login.html"
            } else {
                if (data.length != 0) {
                    for (var i = 0; i < data.typeList.length; i++) {
                        $("#type").append("<option value='" + data.typeList[i].typeId + "'>" + data.typeList[i].typeName + "</option>")
                    }
                    form.render("select");
                }
            }
        });
        form.on('select(type)', function (res) {
            //获取 id 为 tree 的 zTree 对象
            var treeObj = $.fn.zTree.getZTreeObj("tree");
            //获取全部节点数据
            var nodes = treeObj.getNodes();
            var act = treeObj.transformToArray(nodes);//所有对象
            var typeId = res.value;
            var params = {
                "typeId": typeId
            };
            $.post(getRequestPrefix() + "/admin/auth/authList", params, function (data) {
                var funType = data.funtype;
                treeObj.checkAllNodes(false);
                treeObj.expandAll(true);
                if (funType.length !== 0) {
                    for (var j = 0; j < funType.length; j++) {
                        for (var i = 0; i < act.length; i++) {
                            if (funType[j].funId == act[i].funId) {
                                act[i].checked = true;
                                treeObj.updateNode(act[i]);
                            }
                        }
                    }
                }
            });
        });
    });

//树配置
var setting = {
    check: {
        enable: true,
        chkStyle: "checkbox",               //多选
        chkboxType: {"Y": "s", "N": "s"}  //不级联父节点选择
    },
    data: {
        key: {
            name: "funName"
        },
        simpleData: {
            enable: true,
            idKey: 'funId',
            pIdKey: 'parentId'
        }
    },
    callback: {
        onCheck: onCheck
    }
};

function onCheck(event, treeId, treeNode) {
    var treeObj = $.fn.zTree.getZTreeObj("tree");
    var nodes = treeObj.getCheckedNodes(true);

    for (var i = 0; i < nodes.length; i++) {
        //alert(nodes[i].funid);
        //$('#funId').val(nodes[i].funid);
    }
}


//绑定章节树数据
function BindTree() {
    $.post(getRequestPrefix() + "/admin/fun/funList", function (data) {
        if (data.length != 0) {
            for (var i = 0; i < data.length; i++) {
                if (data[i].funId == 0)
                    data[i].open = true;
            }
            $.fn.zTree.init($("#tree"), setting, data);
        }
    });
};


$(document).ready(function () {
    BindTree();
});

function submitAuth() {
    if ($('#type').val() == '') {
        layer.msg("角色类型不能为空");
        return false;
    }
    var checkedNode;
    var str = 0;
    var treeObj = $.fn.zTree.getZTreeObj("tree");
    checkedNode = treeObj.getCheckedNodes(true);
    for (var j = 0; j < checkedNode.length; j++) {
        str = str + checkedNode[j].funId + ","
    }
    str = str.substring(0, str.length - 1);
    var typeId = $('#type').val();
    $("#authForm").attr('enctype', 'application/x-www-form-urlencoded');
    $("#authForm").attr('action', 'admin/auth/saveAuth');

    var params = {
        "typeId": typeId, "str": str
    };
    $.post(getRequestPrefix() + "/admin/auth/saveAuth", params, function (data) {
        var msg = data.msg;
        if (msg == "0") {
            layer.msg("操作成功");
            setTimeout(function () {
                window.location.reload();
            }, 1000)
        } else {
            layer.msg("修改失败");
        }
    });
}


</script>
</body>

</html>